import 'package:flutter/material.dart';

class ListViewDemo extends StatefulWidget {
  const ListViewDemo({Key? key}) : super(key: key);

  @override
  State<ListViewDemo> createState() => _ListViewDemoState();
}

class _ListViewDemoState extends State<ListViewDemo> {

  List list = [];
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    for(int i = 0;i<100;i++){
      list.add("items $i");
    }
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("ListView 列表"),
      ),
      // 用来加载 列表式布局
      // body: ListView(
      //   // ziwidget的方向
      //   scrollDirection: Axis.vertical,
      //   // 回弹效果
      //   physics: BouncingScrollPhysics(),
      //   children: [
      //     Container(color:Colors.grey,height: 84,margin: EdgeInsets.all(10),),
      //     Container(color:Colors.grey,height: 84,margin: EdgeInsets.all(10),),
      //     Container(color:Colors.grey,height: 100,margin: EdgeInsets.all(10),),
      //     Container(color:Colors.grey,height: 184,margin: EdgeInsets.all(10),),
      //     Container(color:Colors.grey,height: 84,margin: EdgeInsets.all(10),),
      //     Container(color:Colors.grey,height: 154,margin: EdgeInsets.all(10),),
      //   ],
      // ),
      // body: ListView.builder(
      //   itemBuilder: (BuildContext context,int index){
      //     // 用来构建 子条目
      //     // index 是条目的下标
      //     return Container(
      //       color: Colors.grey[300],
      //       height: 88,
      //       margin: EdgeInsets.all(5),
      //       child: Text(list[index]),
      //     );
      //   },
      //   // 数据的个数
      //   itemCount: list.length,

      //   ),
      // 自带分隔线
      body: ListView.separated(
        // 构建分隔线
        separatorBuilder: (context, index) {
          if(index%2 == 0){
            return Container(height: 2,color:Colors.blue);
          }else{
            return Container(height: 2,color:Colors.red);
          }
        }
          
        ,
        itemBuilder: (BuildContext context,int index){
          // 用来构建 子条目
          // index 是条目的下标
          return Container(
            color: Colors.grey[300],
            height: 88,
            margin: EdgeInsets.all(5),
            child: Text(list[index]),
          );
        },
        // 数据的个数
        itemCount: list.length,

        ),

    );
    
  }
}